<template>
  <div>
    <div class="infos">
      <div class="info-item">
        <label>坐落：</label>
        <el-input v-model="store[props.name].houseInfo.zl" placeholder="请输入坐落信息" />
      </div>
      <div class="info-item">
        <label>建筑面积：</label>
        <el-input
          v-model.number="store[props.name].houseInfo.scjzmj"
          placeholder="请输入建筑面积"
          type="number"
        />
      </div>
    </div>
  </div>
</template>
<script setup lang="ts">
import { useBizStore } from '@/store/modules/biz'
import { computed, onMounted } from 'vue'
import { ElInput } from 'element-plus'

const props = defineProps({
  transactionId: {
    type: String,
    default: '',
  },
  name: {
    type: String,
    default: '',
  },
})

const store: any = useBizStore(props.transactionId)()

// 提供一个获取houseInfo的计算属性，便于在其他地方使用
const houseInfo: any = computed(() => {
  return store[props.name]?.houseInfo || {}
})
</script>

<style lang="scss" scoped>
.infos {
  padding: 10px;
}

.info-item {
  margin-bottom: 15px;
  display: flex;
  align-items: center;
  gap: 10px;

  label {
    font-weight: 500;
    min-width: 80px;
  }

  .el-input {
    width: 300px;
  }
}
</style>
